<template>
	<div class="warp">
		<div class="content">
			<ux-grid ref="multipleTable" :data="allInfo" style="width: 100%;" :header-cell-style="{
				color: 'rgba(0, 0, 0)',
				fontSize: '14px',
				textAlign: 'center',
				fontWeight: '700',
				padding: 0,
				height: '32px',
			}" :cell-style="cellStyle" :selectable="Isselectable" :row-style="{
				color: 'rgba(96,98,102,1)',
				fontSize: '14xpx',
				textAlign: 'left',
				padding: 0,
				height: '32px',
			}" @selection-change="handleSelectionChange" :height="TabelHeight"
				:element-loading-text="$t('message.bhView.loading')" v-loading="loading" :checkbox-config="{
					showHeader: true,
					checkMethod: checkMethod
				}" @row-click="handerClick">
				<template slot="empty"> No data </template>
				<ux-table-column type="checkbox" width="50" fixed="left" align="center"> </ux-table-column>



				<ux-table-column property="MAC_NUMB" :title="tabelColumnData[0].keyName"
					:width="tabelColumnData[0].width" :fixed="tabelColumnData[0].isFlex ? 'left' : ''"
					v-if="tabelColumnData[0].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.MAC_NUMB }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="COR_NAME" :title="tabelColumnData[1].keyName"
					:width="tabelColumnData[1].width" :fixed="tabelColumnData[1].isFlex ? 'left' : ''"
					v-if="tabelColumnData[1].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.COR_NAME }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="COMMENT3MK" :title="tabelColumnData[2].keyName"
					:width="tabelColumnData[2].width" :fixed="tabelColumnData[2].isFlex ? 'left' : ''"
					v-if="tabelColumnData[2].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.COMMENT3MK }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="GRP_NAME" :title="tabelColumnData[3].keyName"
					:width="tabelColumnData[3].width" :fixed="tabelColumnData[3].isFlex ? 'left' : ''"
					v-if="tabelColumnData[3].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.GRP_NAME }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="NO_NAME" :title="tabelColumnData[4].keyName"
					:width="tabelColumnData[4].width" :fixed="tabelColumnData[4].isFlex ? 'left' : ''"
					v-if="tabelColumnData[4].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.NO_NAME }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="ISP_MET_NAME" :title="tabelColumnData[5].keyName"
					:width="tabelColumnData[5].width" :fixed="tabelColumnData[5].isFlex ? 'left' : ''"
					v-if="tabelColumnData[5].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.ISP_MET_NAME }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="PART_NAME" :title="tabelColumnData[6].keyName"
					:width="tabelColumnData[6].width" :fixed="tabelColumnData[6].isFlex ? 'left' : ''"
					v-if="tabelColumnData[6].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.PART_NAME }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="THK_TYP_NAME" :title="tabelColumnData[7].keyName"
					:width="tabelColumnData[7].width" :fixed="tabelColumnData[7].isFlex ? 'left' : ''"
					v-if="tabelColumnData[7].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.THK_TYP_NAME }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="ICD_CST_NAME" :title="tabelColumnData[8].keyName"
					:width="tabelColumnData[8].width" :fixed="tabelColumnData[8].isFlex ? 'left' : ''"
					v-if="tabelColumnData[8].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.ICD_CST_NAME }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="THK_OPE_NAME" :title="tabelColumnData[9].keyName"
					:width="tabelColumnData[9].width" :fixed="tabelColumnData[9].isFlex ? 'left' : ''"
					v-if="tabelColumnData[9].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.THK_OPE_NAME }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="LIFE_CNT" :title="tabelColumnData[10].keyName"
					:width="tabelColumnData[10].width" :fixed="tabelColumnData[10].isFlex ? 'left' : ''"
					v-if="tabelColumnData[10].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.LIFE_CNT }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="LIFE_MAX" :title="tabelColumnData[11].keyName"
					:width="tabelColumnData[11].width" :fixed="tabelColumnData[11].isFlex ? 'left' : ''"
					v-if="tabelColumnData[11].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.LIFE_MAX }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="STD_DATE" :title="tabelColumnData[12].keyName"
					:width="tabelColumnData[12].width" :fixed="tabelColumnData[12].isFlex ? 'left' : ''"
					v-if="tabelColumnData[12].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.STD_DATE }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="CYC" :title="tabelColumnData[13].keyName" :width="tabelColumnData[13].width"
					:fixed="tabelColumnData[13].isFlex ? 'left' : ''" v-if="tabelColumnData[13].isShow" align="center"
					style="background:red;">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.CYC }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="TBMPLNDATE" :title="tabelColumnData[14].keyName"
					:width="tabelColumnData[14].width" :fixed="tabelColumnData[14].isFlex ? 'left' : ''"
					v-if="tabelColumnData[14].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.TBMPLNDATE }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="CBMPLNDATE" :title="tabelColumnData[15].keyName"
					:width="tabelColumnData[15].width" :fixed="tabelColumnData[15].isFlex ? 'left' : ''"
					v-if="tabelColumnData[15].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.CBMPLNDATE }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="OPE_PLN_DATE" :title="tabelColumnData[16].keyName"
					:width="tabelColumnData[16].width" :fixed="tabelColumnData[16].isFlex ? 'left' : ''"
					v-if="tabelColumnData[16].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.OPEPLNDATE }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="UPD_PLN_DATE" :title="tabelColumnData[17].keyName"
					:width="tabelColumnData[17].width" :fixed="tabelColumnData[17].isFlex ? 'left' : ''"
					v-if="tabelColumnData[17].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.UPDPLNDATE }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="OPE_REAS" :title="tabelColumnData[18].keyName"
					:width="tabelColumnData[18].width" :fixed="tabelColumnData[18].isFlex ? 'left' : ''"
					v-if="tabelColumnData[18].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.OPEREAS }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="UPD_REAS" :title="tabelColumnData[19].keyName"
					:width="tabelColumnData[19].width" :fixed="tabelColumnData[19].isFlex ? 'left' : ''"
					v-if="tabelColumnData[19].isShow" align="center">
					<template slot-scope="scope">
						<p class="t-center">{{ scope.row.UPDREAS }}</p>
					</template>
				</ux-table-column>

				<ux-table-column property="timeYear" width="110" v-for="(item, index) in tiemArr" :key="index"
					:title="item.key.toString()" align="center">
					<template slot-scope="scope ">
						<p :class="[scope.row.dataJson[index].value == '●'
							|| scope.row.dataJson[index].value == '◎'
							|| scope.row.dataJson[index].value == '○' ? 'tiemFlgS' : '']">{{
								scope.row.dataJson[index].value }}</p>
					</template>
				</ux-table-column>
			</ux-grid>

			<div class="select-legend-view" v-show="CADFlg">
				<div class="select-legend">
					<el-radio-group v-model="radio" @change="$store.commit('changeMsDetailRadio', radio)">
						<el-radio label="2">{{
							$t("message.tooltip.title_4")
						}}</el-radio>
						<el-radio label="1">{{
							$t("message.tooltip.title_3")
						}}</el-radio>
					</el-radio-group>
				</div>
			</div>

			<div class="CADView" v-show="CADFlg">
				<CadViewForMS class="CADView" ref="cadViewForMS" :isShowMarkups="radio"
					@onMarkupSelected="onMarkupSelected" />
			</div>

			<div class="bottom">
				<span>件数 = {{ countNum }} 件</span>
				<span>対象点数 = {{ checkList.length }}件</span>
				<!-- <span>{{ testShow.planDayRemark }}</span> -->
				<span>{{ testShow.experRemark }}</span>
			</div>
		</div>
	</div>
</template>

<script>
import $ from "jquery";
import {
	getOfferHeaderObjctl,
	getHeaderConfig,
	GetThckDeterPlanCondSet,
	SetThckDeterPlanCondSet,
	GetThckDeterPlanList,
	GetThckDeterPlanRemark,
	getThckDeterPlanHeightOpeYm
} from "@/api/api";
import eventBus from "@/eventBus/bus";
import CadViewForMS from "./MT_Svg.vue";
import { getLocalStorage } from "@/utils/storage";
import _ from 'lodash-es';
export default {
	name: "PlanContent",
	props: {
		timeFlg: Number,
		// changeMsDetailRadio
		VisualDetailPlanCombox: {
			type: String,
			default: 'リスト'
		}
	},
	data() {
		return {
			diffNum: 0,
			countNum: 0,
			TabelHeight: 265,
			radio: this.$store.state.msDetailRadio,
			allInfo: [],
			tiemArr: [],
			tempYear: [],
			tempDay: [],
			checkList: [],
			loading: false,
			stateData: {},
			testShow: '',
			isNowYear: "",
			macType: this.$store.state.macType,
			tabelColumnData: [{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false }
			],
			userName: getLocalStorage("userName"),
			tabelTitle: [],
			leftNum: 0,
			CADFlg: false,
			selectRow: {},
		};
	},
	components: {
		CadViewForMS
	},
	watch: {
		timeFlg: {
			immediate: true,
			handler(nVal) {
				this.getOfferHeaderObjctlApi();
			}
		},
		selectRow: {
			immediate: true,
			handler(nVal, oVal) {
				console.log(nVal)
				// console.log(this.selectRow.MAC_NUMB);
				console.log(11);

				if (!this.CADFlg || nVal.DMG_CODE == oVal.DMG_CODE) {
					console.log(22);

					return
				}
				console.log(33);
				this.$refs.cadViewForMS.loadSvgDataByRow(
					Number(nVal.DMG_CODE) ? Number(nVal.DMG_CODE) : 18771, 'colorOptionsValue', 'LifeAssBaseVaule', this.$store.state.pltCode == "" ? 9 : this.$store.state.pltCode, this.selectRow.MAC_NUMB, 'fasd', false, false, 3
				);
			}
		},
		VisualDetailPlanCombox: {
			immediate: true,
			handler(nVal, oldV) {
				console.log(nVal)
				if (nVal == 'リスト') {
					this.TabelHeight = this.TabelHeight + 331;
					this.CADFlg = false;
				} else {
					console.log(this.selectRow)
					this.TabelHeight = this.TabelHeight - 331;
					this.CADFlg = true;
				}
				setTimeout(() => {
					this.$refs.cadViewForMS.loadSvgDataByRow(
						Number(this.selectRow.DMG_CODE) ? Number(this.selectRow.DMG_CODE) : 18771, 'colorOptionsValue', 'LifeAssBaseVaule', this.$store.state.pltCode == "" ? 9 : this.$store.state.pltCode, this.selectRow.MAC_NUMB, 'fasd', false, false, 3
					);
				}, 300);
			}
		},

	},
	methods: {
		//右下角图纸中markup选中回调
		onMarkupSelected(pos, name) {
			this.allInfo.forEach((i, v) => {
				if (i.POSNP == pos && name == i.MAC_NUMB) {
					this.selectRow = i;
					this.$refs.multipleTable.setCurrentRow(i);
					this.$refs.multipleTable.pagingScrollTopLeft((v - 2) * 32);
				}
			})
		},
		//1.获取宽高标头的配置
		async getOfferHeaderObjctlApi(isClearSet) {
			// clear,清空抽出设置
			if (isClearSet) {
				let dataJSon = {
					corrosionLoop: 0,
					ctg: 0,
					from: "",
					imp: 0,
					inspMethod: 0,
					law: 0,
					macName: "",
					measurementSite: 0,
					planType: 0,
					screenObj: 0,
					thk1: false,
					thk2: false,
					thk3: false,
					thk4: false,
					thk5: false,
					thk6: false,
					thk7: false,
					thk8: false,
					thk9: false,
					thk10: false,
					thkArr: [],
					to: "",
					uncheckedPeriod: '',
					Account: getLocalStorage("userName")
				};
				await SetThckDeterPlanCondSet(dataJSon);
			}
			this.loading = true;
			let dataJson = {
				language: parseInt(getLocalStorage("lang") == "1" ? 2 : 1),
				formID: "AM22000",
				cntlName: "Spread",
				macType: this.$store.state.macType,
			};
			getOfferHeaderObjctl(dataJson).then(res => {
				console.log('表头', res.data.data);
				this.tabelTitle = res.data.data;
				this.getHeaderConfigApi(isClearSet);
			});
			// if (isClearSet) {
			// 	let sss = {
			// 		Acc: this.userName,
			// 		CrrCode: 0,
			// 		InsPos: "",
			// 		InsPurCode: 0,
			// 		ScreenEnd: "",
			// 		ScreenStart: "",
			// 		ctgCode: 0,
			// 		impCode: 0,
			// 		lawCode: 0,
			// 		macNumb: "",
			// 		screenObj: 0,
			// 		uncheckedPeriod: 0
			// 	}
			// 	let rr = await AddVisualDetailPlanUserCodSource(sss)
			// 	console.log(rr, "2222222222222222222222")
			// }
		},
		getHeaderConfigApi(isClearSet) {
			this.tabelColumnData = [{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false },
			{ isShow: false }];
			let dataJson = {
				account: this.userName,
				formID: "AM22000",
				MacType:
					this.$store.state.macType == "" ? 0 : this.$store.state.macType
			};
			this.leftNum = 0;
			getHeaderConfig(dataJson).then(res => {
				if (res.data.code != 0) {
					return;
				}
				this.tabelColumnData = [];
				console.log('表头属性', res.data.data);
				res.data.data.forEach((item, index) => {
					console.log(this.tabelTitle[index], item.width);
					this.tabelColumnData.push({
						isFlex: item.isFlex,
						isShow: item.isShow,
						width: item.width,
						keyName: this.tabelTitle[index],
						index: item.index
					});
					if (item.isShow) {
						this.leftNum++;
					}
				});
				console.log(this.tabelColumnData, "获取表格配置");
				this.tabelColumnData.forEach(item => {
					if (item.isShow && !item.isFlex) {
						this.diffNum += item.width;
					}
				})
				this.GetVisualDetailPlanUserCodSourceApi(isClearSet);
			});
		},
		//2.获取用户配置=>是否有抽出条件=？
		async GetVisualDetailPlanUserCodSourceApi(isClearSet = false) {
			let dataJson = {
				Account: this.userName
			};

			let res = await GetThckDeterPlanCondSet(dataJson);
			console.log(res, "获取用户配置");
			let test = false;
			if (res.data.code == 0) {
				if (_.isEqual(res.data.data, {
					corrosionLoop: 0,
					ctg: 0,
					from: "",
					imp: 0,
					inspMethod: 0,
					law: 0,
					macName: "",
					measurementSite: 0,
					planType: 0,
					screenObj: 0,
					thk1: 0,
					thk2: 0,
					thk3: 0,
					thk4: 0,
					thk5: 0,
					thk6: 0,
					thk7: 0,
					thk8: 0,
					thk9: 0,
					thk10: 0,
					thkArr: [],
					to: "",
					uncheckedPeriod: ''
				})) {
					test = false;
				} else {
					test = true;
				}
			}
			// if (res.data.code == -310) {

			// }

			this.$emit('isUserEmpty', test)
			console.log(test);
			let upDataJson = {
				PltCode:
					this.$store.state.pltCode == "" ? 0 : this.$store.state.pltCode,
				Account: this.userName,
				DispTyp: this.timeFlg,
				MacType:
					this.$store.state.macType == "" ? 0 : this.$store.state.macType,
			};
			this.GetThckDeterPlanListApi(upDataJson);

		},
		//3.获取数据
		async GetThckDeterPlanListApi(dataJson) {
			//制空已选择的项目
			this.checkList = [];
			// 开始加载数据时，默认无选中
			this.$emit("getSelecData", []);
			//0年1月
			this.allInfo = [];
			this.tiemArr = [];
			dataJson.lang = Number(getLocalStorage('lang'));
			let res = await GetThckDeterPlanList(dataJson);
			await this.GetThckDeterPlanRemarkFn();
			if (res.data.code == -310) {
				this.$refs.cadViewForMS.clearDraws();
				this.countNum = res.data.data.cnt;
			}
			if (res.data.code != 0 && res.data.code != -310) {
				this.$refs.cadViewForMS.clearDraws();
				this.$message({
					type: 'error',
					message: res.data.msg
				})
				this.CADFlg = false;
				this.TabelHeight = $(".warp").height() - 100;
				this.loading = false;
				return
			}

			if (this.VisualDetailPlanCombox == '図面') {
				this.TabelHeight = $(".warp").height() - 431;
			} else {
				this.TabelHeight = $(".warp").height() - 100;
			}
			this.loading = false;
			this.allInfo = JSON.parse(res.data.data.dataList.replace(/\r\n/g, ''));
			console.log(this.allInfo);
			this.countNum = res.data.data.cnt;
			this.selectRow = this.allInfo[0];
			this.$refs.multipleTable.setCurrentRow(this.allInfo[0]);
			this.tiemArr = this.allInfo[0].dataJson;
			console.log(this.allInfo, "获取数据");


			setTimeout(() => {
				this.tiemArr.forEach((item, index) => {
					if (item.key == this.isNowYear.opeYm || item.key == this.isNowYear.opeY) {
						this.$refs.multipleTable.pagingScrollTopLeft(0, (index - 3) * 110 + this.diffNum);
					}
				})
				this.diffNum = 0;
			}, 300);
		},

		//是否可以被选中
		checkMethod({ row }) {
			if (row.IsChoose == 0) {
				return false;
			} else {
				return true;
			}
		},
		// 这只背景色，等一系列样式
		cellStyle({ row, column, rowIndex, columnIndex }) {
			let style = {
				color: "rgba(96,98,102,1)",
				fontSize: "14xpx",
				textAlign: "left",
				padding: 0,
				height: "32px"
			};
			style.textAlign = "center"
			if (columnIndex <= this.leftNum) {
				style.background = "#DCDCFA";
				style.border = "0.5px solid rgb(233, 233, 233)";
			}
			if (row.DISPLAYCOLOR != '' && column.title == 'ﾘｽｸﾚﾍﾞﾙ') {
				style.background = `#${row.DISPLAYCOLOR}`;
			}
			if (column.title == this.isNowYear.opeYm || column.title == this.isNowYear.opeY) {
				style.background = 'rgba(206, 255, 255,1)';
				style.border = "0.1px solid rgb(233, 233, 233)";
				style.transform = 'translateY(-1px)'
			}
			return style;
		},
		Isselectable(row, columnIndex) {
			console.log(row, columnIndex);
		},
		handerClick(e) {
			console.log(e);
			// this.$store.commit("changeMacNameb", e.MAC_NUMB);
			// this.$store.commit("changeMacName", e.MACNAME);
			this.selectRow = e;
		},
		handleSelectionChange(e) {
			this.checkList = e;
			this.$emit("getSelecData", e);
			console.log(e, "已选中的数据");
		},
		async GetThckDeterPlanRemarkFn() {
			let dataJson = {
				PltCode:
					this.$store.state.pltCode == "" ? 0 : this.$store.state.pltCode,
				MacType:
					this.$store.state.macType == "" ? 0 : this.$store.state.macType,
			};
			let res = await GetThckDeterPlanRemark(dataJson);
			this.testShow = res.data.data;
		}
	},
	created() {

		console.log(this.TabelHeight);
		//获取当前年月，渲染水色
		getThckDeterPlanHeightOpeYm({
			pltCode: this.$store.state.pltCode == "" ? 0 : this.$store.state.pltCode,
		}).then(res => {
			this.isNowYear = res.data.data;
			console.log('this.isNowYear', res);
			console.log('this.isNowYear', this.isNowYear);
		})

		// let date = new Date();
		// this.isNowYear = {
		// 	year: date.getFullYear(),
		// 	month:
		// 		date.getMonth() + 1 < 10
		// 			? `0${date.getMonth() + 1}`
		// 			: date.getMonth() + 1
		// };
	},
	mounted() {
		// this.getOfferHeaderObjctlApi();
		if (this.VisualDetailPlanCombox == '図面') {
			this.TabelHeight = $(".warp").height() - 431;
		} else {
			this.TabelHeight = $(".warp").height() - 100;
		}
	},
	beforeDestroy() { },
	destroyed() { },
	updated() {
		// // 使用querySelectorAll选中所有带有.elx-cell--checkbox类的元素
		// var elements = document.querySelectorAll('.elx-cell--checkbox');

		// // 遍历这些元素  
		// elements.forEach(function (element) {
		// 	// 修改每个元素的title属性  
		// 	element.setAttribute('title', '');
		// })
	},
};
</script>
<style lang="scss" scoped>
.warp {
	width: 100%;
	padding: 0 20px;
	height: 100%;
	overflow: hidden;

	.content {
		background-color: #fff;
	}

	.bottom {
		background: rgba(0, 0, 0, 0.01);
		height: 40px;
		line-height: 35px;

		span {
			margin: 0 50px 0 10px;
		}
	}
}

// .isColor {
// 	width: 100%;
// 	height: 100%;
// 	background: rgb(206, 255, 255);
// 	//   text-align: center;
// 	//   line-height: 23px;
// 	//   font-size: 22px;
// }

::v-deep .elx-table .elx-table--fixed-left-wrapper.scrolling--middle {
	box-shadow: none;
}

::v-deep .plTableBox {
	height: 50px;
}

.t-center {
	text-align: center;
}

.t-right {
	text-align: right;
}

.t-left {
	text-align: left;
}

.CADView {
	height: 300px;
	// background-color: red;
}

// ::v-deep thead .elx-header--row:first-child {
//   // display: none;
//   opacity: 0;
// }

.select-legend-view {
	padding: 5px 10px;
	background: #f8f8f8;
}

.tiemFlgS {
	font-size: 20px;
	font-family: "Menlo, Monaco, Courier New, monospace";
	line-height: 24px !important;
	text-align: center;
	height: 24px;
}
</style>
